<!--
 * @Descripttion: unTitle
 * @Author: yizheng.yuan
 * @Date: 2021-11-02 16:50:55
 * @LastEditors: yizheng.yuan
 * @LastEditTime: 2021-11-02 17:17:41
-->
<div>
  <input id="text" type="text" value="Runoob" />
  <button id="sendMessage" >发送消息</button>
</div>
<iframe loading="lazy" id="receiver" src="http://localhost:8080/receiver.html" width="300" height="360">
  <p>你的浏览器不支持 iframe。</p>
</iframe>
<script>
window.onload = function() {
  var receiver = document.getElementById('receiver').contentWindow;
  var btn = document.getElementById('sendMessage');
  btn.addEventListener('click', function (e) {
      e.preventDefault();
      var val = document.getElementById('text').value;
      receiver.postMessage("Hello "+val+"！", "http://localhost:8080");
  });

  window.addEventListener('message', function (e) {  // 监听 message 事件
    console.error('fa--meg',e, e.origin);
  });
}
</script>